<!DOCTYPE html>
<html>
	<head> 
		<meta URIEncoding="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/lib/bootstrap.min.css"/>
		<link rel="stylesheet" href="js/themes/default/easyui.css"/>
		<script src="js/lib/jquery-1.11.0.js"></script>
		<script src="js/lib/bootstrap.min.js"></script>	
		<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<style>
		body{
			font-size:12px;
		}
		table,
		th,
		td {
			border: 1px solid #ccc;
			border-collapse: collapse;
			padding: 5px;
			vertical-align: middle !important;
		}		
		table td:nth-child(odd) {
			background-color: #f1f1f1;
			width:160px;
		}
		table td:nth-child(even) {
			width:160px;
		}
		table tr:nth-child(even) {
			background-color:#ffffff;
		}
		input{
			width:280px;
		}
		span{
			width:20px;color:red;display:inline-block;text-align:center;
		}
		#sho{
			width:300px;
			height:50px;
			background:#d9534f;
			opacity:0.8;
			border-radius:8px;
			color:#fff;
			text-align: center;
			font-size:30px;
			position: absolute;
			top:0px;
			left:550px;
			display:none;
		}
		img{
			margin:10px 2px 0;
			width:150px;
			/*height:150px;*/
			border-radius:5px;
			box-shadow:2px 3px 5px;
			transition:.5s all;			
		}
		img:nth-child(1){
			margin-left:200px;
		}
		img:hover{
			transform:scale(6);
		}
		
	</style>
	<body>	
	<!--图片审核-->
		<div class="">
			<div id="sho"></div>
		<div style="padding:15px 5px 0px 5px;border:1px solid #ccc;margin-bottom:15px;width:60%;margin:0 auto;">
		
			<table class="table table-hover">				
				<tbody>
						<th colspan="8">文库内容上传:</th>
					</tr>
					
					<tr>
						<td>广告标题:</td>
						<td colspan="8">
							<input id="p1" name="title" class="form-control" type="text" style="width:280px"/>
						</td>								
					</tr>
					<tr>
						<td>内容:</td>
						<td colspan="8">							
							<textarea id="p2" name="content" cols="60" rows="10"></textarea>
						</td>								
					</tr>
					<tr style="display:none;">
						<td>图片id:</td>
						<td colspan="8">
							<input id="p3" name="id" value="0" class="form-control" type="text" style="width:280px"/>
						</td>								
					</tr>
					<!-- <tr>
						<td>说明1:</td>
						<td colspan="8">
							<input id="p4" name="remarks" class="form-control" type="text" style="width:280px"/>
						</td>								
					</tr>
					<tr>
						<td>说明2:</td>
						<td colspan="8">
							<input id="p5" name="remarks1" class="form-control" type="text" style="width:280px"/>
						</td>								
					</tr>
					<tr> -->
					 <form method="post" id="formid" enctype="multipart/form-data" >
						<td>图片上传:</td>
						<td colspan="8">
							<input id="p6" name="image" class="form-control" type="file" accept="image/gif,image/jpeg,image/jpg,image/png" style="width:280px;margin-bottom:5px"/>
							<input id="p7" name="image" class="form-control" type="file" accept="image/gif,image/jpeg,image/jpg,image/png" style="width:280px;margin-bottom:5px"/>
							<input id="p8" name="image" class="form-control" type="file" accept="image/gif,image/jpeg,image/jpg,image/png" style="width:280px;margin-bottom:5px"/>
							<input id="p9" name="image" class="form-control" type="file" accept="image/gif,image/jpeg,image/jpg,image/png" style="width:280px;margin-bottom:5px"/>
							<input class="btn btn-danger" type="submit"  id="btn2" value="图片上传" style="width:280px;display:none"/> 
						</td>
					</form> 							
					</tr>	
					<tr>
						<td colspan="8">
							<input class="btn btn-danger" type="button"  id="btn" value="文库上传"/>
						</td>								
					</tr>
					<tr>
						<td colspan="8" style="color:red">
							PS:注意：请务必上传4张图片，否则会图片上传失败；另外请选择合适分辨率的图片上传，以免影响移动端显示效果
						</td>								
					</tr>
				</tbody>
			</table>
			
		</div>
	</body>
	<script>
		$(function(){
			var token = sessionStorage.getItem(key = 1);
			var url = window.baseUrl+"user/app/imagetext/add/txt/"+token;
			var url2 = window.baseUrl+"user/app/imagetext/add/image/"+token; 
			console.log(url)
			$('form').attr('action',url2);
			$('#btn').click(function(){
				var p1 = $('#p1').val();
				var p2 = $('#p2').val();
				var p3 = $('#p3').val();
				var p4 = $('#p4').val();
				var p5 = $('#p5').val();
				var p6 = $('#p6').val();
				var data = {
						title:p1,
						content:p2,
						id:p3,
						remarks:"",
						remarks1:"",
					};
				console.log(data)	
				$.ajax({										
					type:'POST',
					url:url,					
					data:{
						title:p1,
						content:p2,
						id:p3,
						remarks:p4,
						remarks1:p5
					},									
					success:function(data){	
						console.log(data)
						if(data.resp_code == "000000"){
							
							$('#formid').submit();
							alert("成功");
						}else{
							alert(data.resp_message)
						}						
					},
					error:function(data){
						console.log('上传失败，请重试！')
					}
				})
			})
			
		})
		
	</script>
	
</html>




